<template>
  <div class="school">
    <div @click="goback" style="color: #1989fa;">
    <van-icon name="arrow-left" style="position: absolute;
    top: 0;
    left: 16px;
    height: 48px;
    line-height: 48px;
    font-size: 14px;" />
    </div>
    <van-cell-group>
      <van-field
        v-model="orderNo"
        required
        clearable
        label="订单编号"
        placeholder="请输入订单编号"
      />
      <van-field
        v-model="orderAmount"
        required
        clearable
        label="金额"
        placeholder="请输入金额"
      />
      <van-field
        v-model="preAmount"
        label="优惠金额"
        clearable
        placeholder="请输入金额"
        required
      />
    </van-cell-group>
    <van-button class="payBut" type="primary" size="large" @click="pay()">支付</van-button>
  </div>

</template>

<script>
import https from '@/common/https.js'
import {IMG_SERVICE_ADDR} from '@/config/configConstant.js' // 图片前缀地址
export default {
  name: 'pay',
  components: {},
  data () {
    return {
      orderAmount: '0.01',
      preAmount: '0.00',
      images: [],
      orderNo: '',
      payInfo: {},
      value: ''
    }
  },
  mounted () { // created和mounted里面都可以做数据处理，唯一不同的是created dom未完成挂载，mounted已经完成了挂载。
    this.orderNo = new Date().getTime()
  },
  methods: {
    getSwiperData () { // http获取轮播图数据
      let params = {}
      https.fetchPost('/swiper/webs/findSwiperLists', params).then((data) => {
        // console.log('data:' + data.data[0].swiperUrl)
        let swiper = data.data
        if (swiper !== null) {
          swiper.forEach(item => {
            this.images.push(IMG_SERVICE_ADDR + item.swiperUrl)
          })
        }
      }).catch(err => {
        console.log(err)
      })
    },
    goback () {
      this.$router.go(-1)
    },
    pay () {
      let params = {
        orderAmount: this.orderAmount,
        preAmount: this.preAmount,
        orderNo: this.orderNo
      }
      https.fetchPost('/wechat/webs/wxPay', params).then((data) => {
        if (data.status === 200) {
          let payData = data.data
          console.log('payInfo:' + payData.result_code)
          if (payData.result_code === 'SUCCESS') {
            this.payInfo.appId = payData.appid
            this.payInfo.sign = payData.sign
            this.payInfo.timeStamp = payData.timeStamp
            this.payInfo.nonceStr = payData.nonce_str
            this.payInfo.packageStr = payData.packageStr
            this.payInfo.signType = payData.signType
            this.callpay()
          } else if (payData.result_code === 'exist') {
            alert('该订单已支付,请不用重复支付')
          } else if (payData.result_code === 'already') {
            alert('该订单已存在')
          } else if (payData.result_code === 'noDevice') {
            alert('统一下单失败,请重新支付')
          }
        } else {
          alert('下单失败，请重新下单')
        }
      })
    },
    callpay () {
      if (typeof WeixinJSBridge === 'undefined') {
        if (document.addEventListener) {
          document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady, false)
        } else if (document.attachEvent) {
          document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady)
          document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady)
        }
      } else {
        this.onBridgeReady()
      }
    },
    onBridgeReady () {
      WeixinJSBridge.invoke(
        'getBrandWCPayRequest', {
          'appId': this.payInfo.appId, // 公众号名称，由商户传入
          'paySign': this.payInfo.sign, // 微信签名
          'timeStamp': this.payInfo.timeStamp, // 时间戳，自1970年以来的秒数
          'nonceStr': this.payInfo.nonceStr, // 随机串
          'package': this.payInfo.packageStr, // 预支付交易会话标识
          'signType': this.payInfo.signType // 微信签名方式
        },
        function (res) {
          if (res.err_msg === 'get_brand_wcpay_request:ok') {
            alert('支付成功')
          // var PathName = window.location.pathname.substring(1);
          // var ProjectName = PathName.substring(0, PathName.indexOf("/"));
          // var url = window.location.protocol + "//" + window.location.host + "/" + ProjectName
          // window.location.replace(url + "/pay/aliPay/paySucc.html");
          } else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
            alert('支付取消')
          } else if (res.err_msg === 'get_brand_wcpay_request:fail') {
            alert('支付失败')
          }
          // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回ok,但并不保证它绝对可靠。
        }
      )
    }
  }
}
</script>

<style scoped>
  .school {
    margin-top: 100px;
  }
  .payBut {
    margin-top: 50px;
  }
</style>
